<template>
	<section class="home container">
		<div class="l_content">
			<div class="l_content_1 bolder_content">
				<div class="left">
				<button class="btn btn_defalut">
					查询
				</button>
				</div>
				<div class="right">
				<div class="dropdown">
					<button class="btn btn_white">
					更多操作
					</button>
					<div class="dropdown_content">
					<button class="btn btn_white">
						作废
					</button>
					<button class="btn btn_white">
						取消作废
					</button>
					</div>
				</div>
				</div>
			</div>
			<div class="l_content_2">
				<table class="table table-border">
				<thead>
					<tr>
						<th>手术间</th>
						<th>时间</th>
						<th>手术医生</th>
						<th>床位</th>
						<th>患者</th>

						<th>手术名称</th>
						<th>术前诊断</th>
						<th>麻醉方式</th>
						<th>备注</th>
						<th>急诊</th>

						<th>隔离</th>
						<th>访视/随访情况</th>
					</tr>
				</thead>
				<tbody>
					<tr v-for="(item, index) in applyList" :key="item.id">
						<td>{{item.patientMedicalCardNo}}</td>
						<td>{{item.operatingPlanBeginDateTime}}</td>
						<td>{{item.operatingDoctorUsername}}</td>
						<td>{{item.hospitalizedBedNo}}</td>
						<td>{{item.patientUsername}}</td>

						<td>{{item.operationNames.join(',')}}</td>
						<td>{{item.diagnosisBeforeOperation}}</td>
						<td>{{item.anesthesiaMethodName}}</td>
						<td>{{item.note}}</td>

						<td>{{item.isEmergency ? '是' : '否'}}</td>
						<td></td>
						<td></td>
					</tr>

				</tbody>
				<tfoot>
				</tfoot>
				</table>
			</div>
		</div>
		<aside class="r_content">
			<div class="btn_content">
				<button class="btn btn_radius btn_defalut">
				何妙春 
				</button>
				<button class="btn btn_radius btn_grey">
				何妙春
				</button>
				<button class="btn btn_radius btn_grey">
				何妙春
				</button>
				<button class="btn btn_radius btn_grey">
				何妙春
				</button>
				<button class="btn btn_radius btn_grey">
				何妙春
				</button>
				<button class="btn btn_radius btn_grey">
				何妙春
				</button> 
			</div>
		</aside>
	</section>
</template>

<script lang="ts">
import { State, Action, Getter } from 'vuex-class';
import { PatientInfo } from '@/store/common';
import { Component, Vue } from 'vue-property-decorator';
const namespace: string = 'patient';

@Component({
	components: {
	},
})

export default class Patient_Home extends Vue {

	// list = []

	// @Action('aaa', { 'patient' })  add: any;
	@Action('surgicalApplyGetAllAction', { namespace }) getAll: any;
	@Getter('surgicalApplyGetAll', { namespace }) "applyList": string;

	// checkoutStatus () : string {
	// 	return this.$store.getters.patientSt
	// }
	// patientProducts () : string {
	// 	return this.$store.getters['patient/checkoutStatus'];
	// }


	mounted() {
		// console.log()
		// console.log(this.status)
		this.getAll();
		
	} 

	// ...mapGetters('patient', {
	// 	products: 'cartProducts',
	// 	total: 'cartTotalPrice'
	// })
}
</script>

<style lang="scss" scpoed>
	
	.home {
        .btn{
            font-weight:bold;
            font-size:0.17rem;
        }
		.l_content {
			width: 88%;
			text-align: left;
			overflow: hidden;
			float:left;
			.l_content_1{
				padding: 0.2rem;
				overflow: hidden;
				@include bolder;
			}
			.l_content_2{
				margin-top:0.2rem;
				.table{
					tr{
						th:nth-child(7), td:nth-child(7),
						th:nth-child(8), td:nth-child(8){
							width:18%;
							padding: 8px 3%;
						}

						th:nth-child(12), td:nth-child(12){
							width:15%;
							padding: 8px 3%;
						}
					}
				}
			}
		}
		.r_content{
			float:left;
			width:10%;
			@include bolder;
			margin-left: 0.2rem;
			.btn_content{
				padding: 0.1rem;
				.btn{
					margin-top:0.1rem;
					&:first-child{
					margin-top:0rem;
					}
				}

			}
		}
	}
</style>